<!doctype html>
<html>
<head>	
<meta charset="utf-8">
<link rel="stylesheet" href="css/1.css">
<title>林梓瀚个人简介</title>
	<style>
		body{background:url(img/background.jpg);background-repeat: no-repeat;image:100%;}
		.left{width:15%;background:#97EBF5;margin-left: 1%;margin-top: 1%;float: left;border: 2px solid #575555;border-radius:1%;overflow: hidden;}
		.right{width:80%;background:#97EBF5;margin-left: 2.5%;margin-top: 1%;float:left;border: 2px solid #575555;border-radius:0.5%;}
		img{width:80%;}
		.title{width:40%;margin: 0 auto;padding-top: 5%;padding-left:5%;}
		
		.box1{margin-top:8%;margin-left:4%;margin-right:4%; border-bottom:2px solid #1B0BEB;overflow:hidden;}
		.box2{margin-top:2%;padding-left:5%;padding-right:5%;}
		.box3{border-top:2px solid #1B0BEB;padding-top: 1%;}
		.box4{display:inline-block;width:100%; }
		.box5{width:100%;height:20%;}
		
		.fonttitle2{font-size:0.8rem;font-weight: 700;margin:0 auto;margin-top: 5%;padding-left:26%;}
		.fonttitle3{display:inline-block;font-size:1rem;font-weight:700;}
		.righttitle{font-weight:700;padding-bottom: 1%;}
		ul{display:inline-block;}
		li{display:inline-block;}
	 
	  
    
@media (max-width: 902px){.left{width:135px;background:#97EBF5;margin-left: 1%;margin-top: 1%;float: left;border: 2px solid #575555;border-radius:1%;overflow: hidden;}
	                      .right{width:70%;background:#97EBF5;margin-left: 2.5%;margin-top: 1%;float:left;border: 2px solid #575555;border-radius:0.5%;}
}
    
@media (max-width: 578px){.left{width:135px;background:#97EBF5;margin-left: 1%;margin-top: 1%;float: left;border: 2px solid #575555;border-radius:1%;overflow: hidden;}
	                      .right{width:60%;background:#97EBF5;margin-left: 2.5%;margin-top: 1%;float:left;border: 2px solid #575555;border-radius:0.5%;}
}
    
@media (max-width: 433px){.left{width:135px;background:#97EBF5;margin-left: 1%;margin-top: 1%;float: left;border: 2px solid #575555;border-radius:1%;overflow: hidden;}
	                      .right{width:80%;background:#97EBF5;margin-left: 2.5%;margin-top: 1%;float:left;border: 2px solid #575555;border-radius:0.5%;}
}
    
@media (max-width<343px){.left{width:100%;background:#97EBF5;margin-left: 1%;margin-top: 1%;border: 2px solid #575555;border-radius:1%;overflow: hidden;}
	                      .right{width:100%;background:#97EBF5;margin-left: 2.5%;margin-top: 1%;border: 2px solid #575555;border-radius:0.5%;}

}
    
@media (max-width: 169px){.left{width:120px;background:#97EBF5;margin-left: 1%;margin-top: 1%;border: 2px solid #575555;border-radius:1%;overflow: hidden;}
	                      .right{width:120px;background:#97EBF5;margin-left: 2.5%;margin-top: 1%;border: 2px solid #575555;border-radius:0.5%;}
}
    </style>
</head>

<body>
	<div class="left">
		<div class="title"><img src="img/personal.jpg" alt="title"></div>
	       <div id="message">林梓瀚</div>
		   <div id="message">中山大学南方学院</div>
		<div class="box1">
			<svg src="svg/3.svg" width="15" height="15">
             <svg version="1.1" id="人头" focusable="false" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"
	          x="0px" y="0px" viewBox="0 0 1000 1000" style="enable-background:new 0 0 512 512;" xml:space="preserve">
           <path d="M620.256 806.176a32 32 0 0 1-28.256-31.776v-80.736a32 32 0 0 1 13.216-25.92c52.864-38.272 99.168-99.68 124.736-169.152a32 32 0 0 1 19.584-19.2c9.76-3.36 21.536-24.224 32.416-70.72 5.92-25.152-1.024-40.96-16.576-50.4a32 32 0 0 1-15.264-24.48C736.448 181.312 650.144 96 514.24 96c-138.24 0-227.936 88.064-240.672 242.432a32 32 0 0 1-15.04 24.544c-16.416 10.24-22.272 23.36-16.224 44.032 11.392 38.88 23.84 60.352 36.8 68.48a32 32 0 0 1 13.12 16.384c25.088 70.496 72.224 133.536 126.72 173.504a32 32 0 0 1 13.056 25.792V774.4a32 32 0 0 1-28.256 31.776c-125.12 14.72-212.608 54.4-225.952 88.672 2.304 1.056 5.12 2.176 8.384 3.296 17.184 6.016 43.52 11.52 77.12 16.096 65.504 8.896 155.168 13.76 248.704 13.76s183.2-4.864 248.704-13.76c33.6-4.576 59.936-10.08 77.12-16.096 3.296-1.12 6.08-2.24 8.384-3.296-13.344-34.272-100.832-73.92-225.92-88.64z m35.744-59.776c151.36 22.656 256 79.168 256 157.376C912 970.784 755.84 992 512 992s-400-21.216-400-88.224c0-78.208 104.64-134.72 256-157.376V706.88c-56.64-45.536-104.576-110.944-132.576-184.128-23.936-19.392-40.928-51.296-54.528-97.792-12.8-43.648 0.064-81.344 30.336-106.592C231.456 140.48 346.336 32 514.24 32c165.6 0 276.992 105.728 298.08 281.44 29.44 24.864 42.72 63.904 31.968 109.856-13.312 56.768-30.848 92.512-58.976 109.632-28.448 70.624-74.976 133.184-129.312 176.576v36.896z" p-id="4526"/>
</svg>
	    	<div class="fonttitle3">基本信息:</div></div>
		 <ul>
                    <li>
                        <label1>姓名</label1>
                        <label2>林梓瀚</label2>
                    </li>
			  <br>
                    <li>
                        <label1>性别</label1>
                        <label2>男</label2>
                    </li>
			  <br>
                    <li>
                        <label1>学号</label1>
                        <label2>183014188</label2>
                    </li>
			 <br>
			        <li>
                        <label1>年龄</label1>
                        <label2>20岁</label2>
                    </li>

                </ul>
		<div class="box1">
			<svg src="svg/3.svg" width="15" height="15">
             <svg version="1.1" id="电话" focusable="false" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"
	          x="0px" y="0px" viewBox="0 0 1100 1100" style="enable-background:new 0 0 512 512;" xml:space="preserve">
           <path d="M877.1 238.7L770.6 132.3c-13-13-30.4-20.3-48.8-20.3s-35.8 7.2-48.8 20.3L558.3 246.8c-13 13-20.3 30.5-20.3 48.9 0 18.5 7.2 35.8 20.3 48.9l89.6 89.7c-20.6 47.8-49.6 90.6-86.4 127.3-36.7 36.9-79.6 66-127.2 86.6l-89.6-89.7c-13-13-30.4-20.3-48.8-20.3-18.5 0-35.8 7.2-48.8 20.3L132.3 673c-13 13-20.3 30.5-20.3 48.9 0 18.5 7.2 35.8 20.3 48.9l106.4 106.4c22.2 22.2 52.8 34.9 84.2 34.9 6.5 0 12.8-0.5 19.2-1.6 132.4-21.8 263.8-92.3 369.9-198.3C818 606 888.4 474.6 910.4 342.1c6.3-37.6-6.3-76.3-33.3-103.4z m-37.6 91.5c-19.5 117.9-82.9 235.5-178.4 331s-213 158.9-330.9 178.4c-14.8 2.5-30-2.5-40.8-13.2L184.9 721.9 295.7 611l119.8 120 0.9 0.9 21.6-8C570.7 675 674.9 570.8 723.7 438.1l8-21.6-120.8-120.7 110.8-110.9 104.5 104.5c10.8 10.8 15.8 26 13.3 40.8z" p-id="8577"/>
</svg>
	    	<div class="fonttitle3">联系方式:</div></div>
		 <ul>
                    <li>
                        <label1>手机</label1>
                        <label2><a href="https://www.baidu.com/">17819155117</a></label2>
                    </li>
			  <br>
                    <li>
                        <label1>QQ</label1>
                        <label2><a href="https://www.baidu.com/">1362627784</a></label2>
                    </li>
			  <br>
                    <li>
                        <label1>微信</label1>
                        <label2><a href="https://www.baidu.com/">lin61998</a></label2>
                    </li>
                </ul>
			<div class="box1">
			<svg src="svg/3.svg" width="15" height="15">
             <svg version="1.1" id="图表" focusable="false" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"
	          x="0px" y="0px" viewBox="0 0 1100 1100" style="enable-background:new 0 0 512 512;" xml:space="preserve">
         <path d="M544 896l64 0 0 64-64 0 0-64Z" p-id="5003"></path><path d="M416 416 416 64 64 64l0 352 64 0 0 64 64 0 0-64L416 416zM128 352 128 128l224 0 0 224L128 352z" p-id="5004"></path><path d="M192 192l96 0 0 96-96 0 0-96Z" p-id="5005"></path><path d="M608 64l0 352 352 0L960 64 608 64zM896 352l-224 0L672 128l224 0L896 352z" p-id="5006"></path><path d="M736 192l96 0 0 96-96 0 0-96Z" p-id="5007"></path><path d="M192 736l96 0 0 96-96 0 0-96Z" p-id="5008"></path><path d="M64 480l64 0 0 64-64 0 0-64Z" p-id="5009"></path><path d="M192 480l64 0 0 64-64 0 0-64Z" p-id="5010"></path><path d="M256 608 64 608l0 352 352 0L416 608l-96 0 0-64L256 544 256 608zM352 672l0 224L128 896l0-224L352 672z" p-id="5011"></path><path d="M480 96l64 0 0 96-64 0 0-96Z" p-id="5012"></path><path d="M480 256l64 0 0 64-64 0 0-64Z" p-id="5013"></path><path d="M672 480 608 480 544 480 544 384 480 384 480 480 320 480 320 544 480 544 544 544 608 544 608 608 672 608 672 544Z" p-id="5014"></path><path d="M672 608l64 0 0 64-64 0 0-64Z" p-id="5015"></path><path d="M480 608l64 0 0 96-64 0 0-96Z" p-id="5016"></path><path d="M480 768l64 0 0 128-64 0 0-128Z" p-id="5017"></path><path d="M608 704l64 0 0 192-64 0 0-192Z" p-id="5018"></path><path d="M800 608l160 0 0 64-160 0 0-64Z" p-id="5019"></path><path d="M896 480l64 0 0 64-64 0 0-64Z" p-id="5020"></path><path d="M736 480l128 0 0 64-128 0 0-64Z" p-id="5021"></path><path d="M736 704l64 0 0 64-64 0 0-64Z" p-id="5022"></path><path d="M896 768 864 768 864 832 928 832 928 768 960 768 960 704 896 704Z" p-id="5023"></path><path d="M736 832l64 0 0 64-64 0 0-64Z" p-id="5024"></path><path d="M800 896l160 0 0 64-160 0 0-64Z" p-id="5025"></path>
</svg>
	    	<div class="fonttitle3">二维码:</div></div>
		 <ul>
                  <li> <a href="https://www.iqiyi.com/v_19rsi7j958.html"target="_blank"> <img src="img/erweima.jpg"></a>
                  </li>                 
					</ul>
		<div class="box1">
			<svg src="svg/3.svg" width="15" height="15">
             <svg version="1.1" id="图表" focusable="false" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"
	          x="0px" y="0px" viewBox="0 0 1100 1100" style="enable-background:new 0 0 512 512;" xml:space="preserve">
           <path d="M888 792H200V168c0-4.4-3.6-8-8-8h-56c-4.4 0-8 3.6-8 8v688c0 4.4 3.6 8 8 8h752c4.4 0 8-3.6 8-8v-56c0-4.4-3.6-8-8-8z" p-id="8693"></path><path d="M288 712h56c4.4 0 8-3.6 8-8V560c0-4.4-3.6-8-8-8h-56c-4.4 0-8 3.6-8 8v144c0 4.4 3.6 8 8 8zM440 712h56c4.4 0 8-3.6 8-8V384c0-4.4-3.6-8-8-8h-56c-4.4 0-8 3.6-8 8v320c0 4.4 3.6 8 8 8zM592 712h56c4.4 0 8-3.6 8-8V462c0-4.4-3.6-8-8-8h-56c-4.4 0-8 3.6-8 8v242c0 4.4 3.6 8 8 8zM744 712h56c4.4 0 8-3.6 8-8V304c0-4.4-3.6-8-8-8h-56c-4.4 0-8 3.6-8 8v400c0 4.4 3.6 8 8 8z" p-id="8694"/>
</svg>
	    	<div class="fonttitle3">技能点:</div></div>
		 <ul>
                  <li>
                        <label>电脑</label>
					  <br>
                        <progress value="75" max="100"></progress>
                    </li>
                    <li>
                        <label>运动</label>
					  <br>
                        <progress value="50" max="100"></progress>
                    </li>
                    <li>
                        <label>学习</label>
						<div id="box5">
                        <svg xmlns="http://www.w3.org/2000/svg">
  <rect id="moving"
        x="0" y="10"
        width="10%" height="10%"
        fill="#7caaf5">
 
  </rect>
  <animate
           xlink:href="#moving"
           attributeName="x"  
           to="38%"
           dur="5s"
           begin="0s"
		   repeatCount="indefinite"/>
</svg></div>
                    </li>
                   
                </ul>
		
	</div>
	<div class="right">
		
		 <div class="box2">
			 
		    <div class="righttitle">教育经历：</div>
			   <div class="box3">
				   <div class="box4">•<a href="http://jieyang011595.11467.com/">凤湖小学</a></div><div id="one">2016.9-2012.6</div>
				   <div class="box4">•<a href="http://661484.guangdong.8671.net/">三侨中学</a></div><div id="one">2012.9-2015.6</div>
				   <div class="box4">•<a href="http://www.mhzx.net/">棉湖中学</a></div><div id="one">2015.9-2018.6</div>
		  		   <div class="box4">•<a href="http://www.nfu.edu.cn/">中山大学南方学院</a></div><div id="one">2018.9-如今</div>
			 </div>
	</div>  
		
		<div class="box2">
		    <div class="righttitle">目标：</div>
			   <div class="box3">
		          <p>•学有所成</p>
				   <p>•多参赛获奖</p>
				   <p>•多方面磨练自己</p>
				   <p>•去想去的地方</p>
		  		 </div>
			
	</div>
		
	<div class="box2">
		    <div class="righttitle">自我评价：</div>
			   <div class="box3">
		          <p>•过于懒惰</p>
				   <p>•不够活跃</p>
				   <p>•缺乏锻炼</p>
		  		 </div>
		</div>
		
	<div class="box2">
		    <div class="righttitle">其他：</div>
		       <div class="box3">
				   <div class="box4">•gitee仓库地址</div><div id="one"><a href="https://gitee.com/lzhhzl/web__personal_profile.git">https://gitee.com/lzhhzl/web__personal_profile.git</a></div>
				   
			 </div>
		 
				   <div class="box4">•gitee仓库重新提交地址</div><div id="one"><a href="https://gitee.com/lzhhzl/web__personal_profile.git">https://gitee.com/lzhhzl/web-resume.git</a></div>
				   
			 
		 <div class="box4">•gitee仓库最终提交地址</div><div id="one"><a href="https://gitee.com/lzhhzl/LZHresume.git">https://gitee.com/lzhhzl/LZHresume.git</a></div>
				   
			 </div>

		</div>
		
</body>
</html>